
// 此功能封装的是列表渲染
// 例子在个人中心01的列表
// 传递的值有：
// title:名称    href:跳转的路径   image:图片   after:可以在后面添加一个新的标题
// <qm-listitem :list="list" class="middle"> </qm-listitem>

<template id='qm-listitem'>
  <f7-list>
    <f7-list-item
      :link="item.href"
      :title="item.title"
      v-for="(item, index) in list"
      :key="index"
      :after='item.after'
    >
     <f7-icon slot="media" class="icon" v-if="item.image">
          <img :src="item.image" alt="" class="myicon"  />
      </f7-icon>
    </f7-list-item>
  </f7-list>
</template>

<script>
export default {
  props: {
    list: {
      type: Array,
      default: [],
    },
  },
};
</script>

<style lang="less" scoped>
.icon{
  text-align: center;
  line-height: 0;
}
.myicon {
  width: 20px;
  height: 20px;
}
</style>
